<template>
	<view class="qilin-aboutAuthor qilin-border-radius-card">
		<image src="https://wx4.sinaimg.cn/bmiddle/006aaKeggy1hwq77lcbsrj328w19c7wl.jpg"></image>
		<view class="qilin-aboutAuthor-content">
			<view class="qilin-aboutAuthor-content-title">《Qilin-app》</view>
			<view class="qilin-aboutAuthor-content-list">
				<view class="item">此项目采用uv-ui组件库，代码精简且注释详细，方便本人作为往移动端方向深造的基础平台。</view>
				<view class="item">此项目主要参照前端铺子小程序开发，所有代码皆为本人一字一字敲打，旨在将移动端方法或组件统一封装，便于以后开发技术进步和提高工作效率。</view>
			</view>
		</view>
	</view>
</template>

<script setup>
import {ref} from "vue";


/*
    响应式选项区域
*/


/*
    数据变量定义区域
*/


/*
    计算属性等代码区域
*/


/*
    逻辑脚本代码区域
*/


/*
    生命周期等代码区域
*/


</script>
<style lang="scss" scoped>
.qilin-aboutAuthor{
	width:100%;
	position:relative;
	background-color:#fff;
	// min-height:1000upx;
	// max-height:1000upx;
	>image{
		position:absolute;
		left:0;
		top:-15%;
		width:100%;
		z-index:1;
		height:420upx;
		opacity:0.7;
		border-radius:$border-radius-card $border-radius-card 0 0;
	}
	>.qilin-aboutAuthor-content{
		width:100%;
		padding:320upx 20upx 100upx;
		>.qilin-aboutAuthor-content-title{
			font-size:30upx;
			font-weight:bolder;
			color:var(--qilin-color-warning);
			text-align:center;
			padding:20upx 0;
			letter-spacing:4upx;
		}
		>.qilin-aboutAuthor-content-list{
			>.item{
				position:relative;
				padding-left:25upx;
				margin:20upx 0;
				font-size:25upx;
				letter-spacing:4upx;
				color:var(--qilin-color-info);
				&::before{
					content:"";
					width:10upx;
					height:10upx;
					border-radius:$border-radius-circle;
					background-color:var(--qilin-color-primary);
					position:absolute;
					left:0;
					top:15upx;
				}
			}
		}
	}
}
</style>